import { Component } from 'react';

import { Boxs    } from 'saltui';
const { HBox, Box,VBox } = Boxs;

import './rate.less';



export default class Page extends Component {
  constructor(props) {
    super(props);
    this.state = {
        readOnly: props.readOnly
    }
  }
 
  handleShow(i){
    let readOnlyVal = this.props.readOnly;
    if(!readOnlyVal){
      let scores= this.props.item.list;
      for (var j = 0; j < scores.length; j++) {
        let obj = scores[j];
        if (i == j) {
          obj.checked = true;
        }else{
          obj.checked = false;
        }      
      };
      this.setState({
        scores:scores,
      });
      this.props.onChange(i+1);
    }
  }

  render() {
    let t = this;
    return (
    <tr>
        <th>{t.props.item.name}</th>
        {
            t.props.item.list.map(function (item2, i) {
            return (
                <td>
                <HBox vAlign="top" className="t-FS14 t-FC3 t-FBJC">
                    <Box onClick={t.handleShow.bind(this,i)}>
                      <div className={item2.checked?'t-checkbox-field-icon-list t-MT2 t-list-cricle checked':'t-checkbox-field-icon-list un-checked t-list-cricle t-MT2'}  >
                        <i className="iconfont icon-checked t-FCf t-FS14"></i>
                      </div>
                    </Box>
                </HBox>
                </td>
            )
            }.bind(this))
        }
    </tr>
    );
  }
}



